<template>
  <div :style="{ width: props.width, height: props.height }">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      :width="props.width"
      :height="props.height"
      viewBox="0 0 370.758 221.08"
      preserveAspectRatio="none meet"
    >
      <g id="边框4" transform="translate(-78.919 -118.664)">
        <g id="组_5031" data-name="组 5031">
          <path
            id="路径_1179"
            data-name="路径 1179"
            d="M416.811,119.831h-306.7L85.918,150.41V295.09l19.625,31.492H290.387"
            fill="none"
            :stroke="states.color"
            stroke-miterlimit="10"
            stroke-width="2.333"
          />
          <path
            id="路径_1180"
            data-name="路径 1180"
            d="M84.853,149.8l-5.933,6.922v130.3l5.933,8.543Z"
            :fill="states.color"
          />
          <rect
            id="矩形_43"
            data-name="矩形 43"
            width="5.962"
            height="5.962"
            transform="translate(238.3 120.858)"
            :fill="states.color"
          />
          <rect
            id="矩形_44"
            data-name="矩形 44"
            width="5.962"
            height="5.962"
            transform="translate(248.683 120.858)"
            :fill="states.color"
          />
          <rect
            id="矩形_45"
            data-name="矩形 45"
            width="5.962"
            height="5.962"
            transform="translate(259.722 120.858)"
            :fill="states.color"
          />
          <rect
            id="矩形_46"
            data-name="矩形 46"
            width="5.962"
            height="5.962"
            transform="translate(271.161 120.858)"
            :fill="states.color"
          />
          <rect
            id="矩形_47"
            data-name="矩形 47"
            width="5.962"
            height="5.962"
            transform="translate(282.001 121.029)"
            :fill="states.color"
          />
        </g>
        <g id="组_5032" data-name="组 5032">
          <path
            id="路径_1181"
            data-name="路径 1181"
            d="M111.785,338.578h306.7L442.679,308V163.318l-19.625-31.492H238.21"
            fill="none"
            :stroke="states.color"
            stroke-miterlimit="10"
            stroke-width="2.333"
          />
          <path
            id="路径_1182"
            data-name="路径 1182"
            d="M443.744,308.607l5.933-6.922v-130.3l-5.933-8.543Z"
            :fill="states.color"
          />
          <rect
            id="矩形_48"
            data-name="矩形 48"
            width="5.962"
            height="5.962"
            transform="translate(290.297 337.551) rotate(180)"
            :fill="states.color"
          />
          <rect
            id="矩形_49"
            data-name="矩形 49"
            width="5.962"
            height="5.962"
            transform="translate(279.914 337.551) rotate(180)"
            :fill="states.color"
          />
          <rect
            id="矩形_50"
            data-name="矩形 50"
            width="5.962"
            height="5.962"
            transform="translate(268.874 337.551) rotate(180)"
            :fill="states.color"
          />
          <rect
            id="矩形_51"
            data-name="矩形 51"
            width="5.962"
            height="5.962"
            transform="translate(257.436 337.551) rotate(180)"
            :fill="states.color"
          />
          <rect
            id="矩形_52"
            data-name="矩形 52"
            width="5.962"
            height="5.962"
            transform="translate(246.596 337.38) rotate(180)"
            :fill="states.color"
          />
        </g>
      </g>
    </svg>
  </div>
</template>

<script setup lang="ts">
import { computed } from "vue";

let props = defineProps({
  width: {
    type: String,
    default: "",
  },
  height: {
    type: String,
    default: "",
  },
  models: {
    type: Object,
    default: () => ({}),
  },
});
const states = computed({
  get: () => props.models,
  set: () => {},
}) as any;
</script>

<style scoped lang="scss"></style>
